/**
 * @desecription vue.config.js全局配置
 */
const path = require('path')
const {
    baseURL,
    publicPath,
    assetsDir,
    outputDir,
    lintOnSave,
    transpileDependencies,
    title,
    abbreviation,
    devPort,
    build7z,
    buildGzip,
    imageCompression,
    providePlugin
} = require('./src/config')
const rely = require('vue-plugin-rely')
const {version, author} = require('./package.json')
const WebpackBar = require('webpackbar')
const FileManagerPlugin = require('filemanager-webpack-plugin')
const CompressionWebpackPlugin = require('compression-webpack-plugin')
process.env.VUE_APP_TITLE = title
process.env.VUE_APP_AUTHOR = author
process.env.VUE_APP_VERSION = version
process.env.VUE_APP_RELY = rely
const resolve = (dir) => {
    return path.join(__dirname, dir)
}

module.exports = {
    publicPath,
    assetsDir,
    outputDir,
    lintOnSave,
    transpileDependencies,
    devServer: {
        hot: true,
        port: devPort,
        open: false,
        noInfo: false,
        overlay: {
            warnings: true,
            errors: true,
        },
        // 注释掉的地方是前端配置代理访问后端的示例，一定要注意，这里配置了跨域及代理只针对开发环境生效！！！
        // 不建议你在前端配置跨域，建议你后端配置放行token字段，一步到位
        proxy: {
            [baseURL]: {
                //target: 'http://192.168.0.203:9001/',
                target: 'http://124.70.200.192:9001/',
                // target: 'http://192.168.43.69:9001/',
                ws: true,
                changeOrigin: true,
                pathRewrite: {
                    ['^' + baseURL]: '',
                },
            },
        },
    },
    configureWebpack() {
        return {
            resolve: {
                extensions: [".ts", ".tsx", ".js", ".json"],
                alias: {
                    '@': resolve('src'),
                    '*': resolve(''),
                }
            },
            module: {
                rules: [
                    {
                        test: /\.tsx?$/,
                        loader: 'babel-loader',
                        options: {
                            presets: [
                                '@babel/preset-env',
                                ['@babel/preset-typescript',   // 引用Typescript插件
                                    {
                                        allExtensions: true,        // ?支持所有文件扩展名
                                    }
                                ]
                            ]
                        }
                    }
                ]
            },
            plugins: [new WebpackBar({'name': '首码科技打包'})]
        }
    },
    chainWebpack(config) {
        config.entry('app').clear().add('./src/main.ts')
        config.resolve.symlinks(true)
        config.module.rule('svg').exclude.add(resolve('src/icon'))
        config.module
            .rule('vabIcon')
            .test(/\.svg$/)
            .include.add(resolve('src/icon'))
            .end()
            .use('svg-sprite-loader')
            .loader('svg-sprite-loader')
            .options({symbolId: 'vab-icon-[name]'})
        config.when(process.env.NODE_ENV === 'development', (config) => {
            config.devtool('source-map')
        })
        config.when(process.env.NODE_ENV === 'production', (config) => {
            config.performance.set('hints', false)
            config.devtool('none')
            config.optimization.splitChunks({
                chunks: 'all',
                cacheGroups: {
                    libs: {
                        name: 'sm-pro-libs',
                        test: /[\\/]node_modules[\\/]/,
                        priority: 10,
                        chunks: 'initial',
                    },
                    elementUI: {
                        name: 'element-ui',
                        priority: 20,
                        test: /[\\/]node_modules[\\/]_?element-ui(.*)/,
                    },
                },
            })
            if (imageCompression)
                config.module
                    .rule('images')
                    .use('image-webpack-loader')
                    .loader('image-webpack-loader')
                    .options({bypassOnDebug: true}).end()
            if (buildGzip)
                config.plugin('compression').use(CompressionWebpackPlugin, [
                    {
                        filename: '[path][base].gz[query]',
                        algorithm: 'gzip',
                        test: new RegExp(
                            '\\.(' + productionGzipExtensions.join('|') + ')$'
                        ),
                        threshold: 8192,
                        minRatio: 0.8,
                    },
                ])
            if (build7z)
                config.plugin('fileManager').use(FileManagerPlugin, [
                    {
                        events: {
                            onEnd: {
                                archive: [
                                    {
                                        source: `./${outputDir}`,
                                        destination: `./${outputDir}/${abbreviation}_shouma-web.7z`,
                                    },
                                ],
                            },
                        },
                    },
                ])
        })
    },
    runtimeCompiler: true,
    productionSourceMap: false,
    css: {
        requireModuleExtension: true,
        sourceMap: true,
        loaderOptions: {
            scss: {
                additionalData(content, loaderContext) {
                    const {resourcePath, rootContext} = loaderContext
                    const relativePath = path.relative(rootContext, resourcePath)
                    if (
                        relativePath.replace(/\\/g, '/') !==
                        'assets/com/style/variables.scss'
                        //'src/vab/styles/variables/variables.scss'
                    )
                        return '@import "~@/assets/com/style/variables.scss";' + content
                    // return '@import "~@/vab/styles/variables/variables.scss";' + content
                    return content
                },
            },
        },
    },
}
